<script setup lang="ts">
import { computed, defineAsyncComponent } from 'vue'
import { RouterView, useRoute } from 'vue-router'
import { APP_NAME } from '../config/constants'

const themes = import.meta.glob('./themes/*.vue') //读取主题

const route = useRoute()
const layout = computed(() => {
  const lay = route.meta.layout
  if (lay) {
    const currectComponent = themes[`./themes/${APP_NAME}-${lay}.vue`]
    const defaultComponent = themes[`./themes/${lay}.vue`]
    return currectComponent
      ? defineAsyncComponent(currectComponent as any)
      : defineAsyncComponent(defaultComponent as any)
  }
  return RouterView
})
</script>

<template>
  <component :is="layout" />
</template>
